@extends('layouts.forum')

@section('title', '创建主题')

@section('css')
@endsection

@section('contaier')
    <div class="topic_create">
        <div class="col-md-8 main-col">
            <div class="reply-box form box-block">
                <div class="alert alert-warning">
                    我们希望 Laravel China 能够成为拥有浓厚技术氛围的开发者社区，而实现这个目标，需要我们所有人的共同努力：友善，公平，尊重知识和事实。请严格遵守 - <a href="{{url('/forum/topic/7')}}">社区发帖和管理规范</a>
                </div>
                <form method="POST" action="{{url('/topic/submit')}}" accept-charset="UTF-8" id="topic-create-form">
                    {{csrf_field()}}
                    <div class="form-group">
                        <label for="partition-select" class="hidden"></label>
                        <select class="selectpicker form-control" name="partition_id" id="partition-select" required>
                            <option value="0" disabled selected>请选择板块</option>
                            @foreach($partitions as $partition)
                                <option value="{{$partition->id}}">{{$partition->title}}</option>
                            @endforeach
                        </select>
                    </div>
                    <div class="form-group">
                        <label for="category-select" class="hidden"></label>
                        <select class="selectpicker form-control" name="category_id" id="category-select" required>
                            <option value="0" disabled selected>请选择分类</option>
                        </select>
                    </div>
                    <div class="form-group">
                        <input class="form-control" id="topic-title" placeholder="请填写标题" name="title" type="text" value="" required>
                    </div>

                    <div id="reply_notice" class="box">
                        @include('include.topic.tips')
                    </div>
                    <div class="form-group">
                        <label for="reply_content" class="hidden"></label>
                        <input type="file" class="hidden" id="uploadImg">
                        <textarea class="form-control" rows="20" id="reply_content" name="reply_content" cols="20"
                                  style="overflow: hidden;word-wrap: break-word;resize: horizontal;height: 164px;">
                        </textarea>
                    </div>
                    <div class="form-group status-post-submit">
                        <input class="btn btn-primary" id="topic-create-submit" type="submit" value="发 布">
                    </div>
                    <div class="box preview markdown-body" id="preview-box"></div>
                </form>
            </div>
        </div>
        <div class="col-md-4 side-bar">
            @include('include.topic.ruls')
        </div>
    </div>
@endsection

@section('js')
    <script>
        var fieldName   = null;
        var body        = $('body');
        $(document).ready(function () {
            body.css("background-color", "whitesmoke");
            body.css("height", "10px");
            $('.popover-with-html').hover(function () {
                $('.popover-with-html').popover({
                    html : true,
                    trigger : 'hover',
                    container: 'body',
                    placement: 'auto top'
                });
            });
            $('#partition-select').change(function () {
                var id = $(this).children('option:selected').val();
                $('#category-select').html('');
                var html = '<option value="0" disabled="" selected="">请选择分类</option>'
                if (id == 0){
                }
                $('#category-select').html(html);
                $.post('{{url('/plate/migration')}}', {
                    id:id,
                    _token:'{{csrf_token()}}'
                },function (data) {
                    if (data.code == 0){
                        var msg = data.msg;
                        var length = msg.length;
                        for (var i = 0; i < length; i++){
                            html +='<option value="'+msg[i].id+'">'+msg[i].name+'</option>'
                        }
                        $('#category-select').html(html);
                    }
                });
            });
            $('#uploadImg').change(function () {
                var formData = new FormData();
                formData.append('file', $(this)[0].files[0]);
                $.ajax({
                    type: "post",
                    url: "/upload/image",
                    data: formData,
                    cache: false,
                    headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
                    contentType: false,
                    processData: false,
                    success: function (data) {
                        if (fieldName != null){
                            fieldName.value = '{{cdn('')}}'+data.url;
                        }
                    },
                    error: function (e) {
                        console.log(e);
                    }
                })
            });
//            content = tinymce.get('reply_content').getContent({format: 'raw'});
        });
    </script>
@endsection